<template>
  <div>
    <div class="lhxwjl-bt">管理团队</div>
    <CustomTable
      ref="table"
      :showAlert="false"
      :showSelection="false"
      :columns="gltdColumns"
      :loading="load"
      @change="onTableChange"
      :dataSource="pageData"
      rowKey="id"
      :pageSizeOptions="['5','10']"
      style="margin-top:10px;"
    >
      <template slot="xh" slot-scope="text, record, index">
        {{((pageFilter.pageNo - 1) * pageFilter.pageSize +(index + 1))>9?(pageFilter.pageNo - 1) * pageFilter.pageSize +(index + 1) :'0' + (index + 1) }}
      </template>
      <!-- <template slot="name" slot-scope="record" >
        <a style="z-index:999" @click="onViewDetails($event,record)">{{record.name}}</a>
      </template> -->
    </CustomTable>
  </div>
</template>

<script>
import api from '@/api/index'
export default {
  props: {
    codeZzjg: {
      type: String
    }
  },
  data() {
    return {
      load: false,
      gltdColumns:[
            {
              title: '序号',
              dataIndex: 'xh',
              key: 'xh',
              width:80,
              scopedSlots: { customRender: "xh" }
            },
            {
              title: '姓名',
              dataIndex: 'name',
              key: 'name',
              ellipsis: true,
              scopedSlots: { customRender: "name" }
            },
            {
              title: '性别',
              dataIndex: 'gender',
              key: 'gender',
              ellipsis: true,
              scopedSlots: { customRender: "gender" }
            },
            {
              title: '身份证',
              dataIndex: 'idcard',
              key: 'idcard',
              ellipsis: true,
              width:150,
            },
            {
              title: '职称',
              dataIndex: 'zhicheng',
              key: 'zhicheng',
              ellipsis: true,
            },
            {
              title: '职务',
              dataIndex: 'zhiwu',
              key: 'zhiwu',
              ellipsis: true,
            },
         ],
      pageData: [],
      pageFilter: {
        pageNo: 1,
        pageSize: 5,
        ryxxlb:'管理团队',
        isPass:true,
      },
    };
  },
  created() {
    this.pageFilter.zzjgdm = this.codeZzjg;
    this.refreshTable();
  },
  methods: {
    onTableChange(pageFilter) {
      this.pageFilter = { ...this.pageFilter, ...pageFilter };
      this.refreshTable();
    },
    refreshTable() {
        this.load = true;
        api.get_ryxx_list(this.pageFilter) .then(res => {
          let pageNo = this.pageFilter.pageNo;
          let pageSize = this.pageFilter.pageSize;
          let records = res.rows;
          let total = res.total;
          this.pageData = {
            ...this.pageData,
            pageNo,
            records,
            pageSize,
            total
          };
          this.load = false;
            
        })
        .catch(err => {
          this.load = false;
        });
      },
    onViewDetails(e,record){
      this.$router.push({
        name:"personDetail",
        query:{
          type:'detail',
          item:record,
          breadcrumbName:'从业人员'
        }      
      });    
   },
  }
};
</script>

<style lang="less">
.lhxwjl-bt {
  color: #333333;
  font-size: 16px;
  font-weight: 400;
  margin-top: 20px;
  margin-left: 10px;
}
</style>